<template>
	<view>
		<!-- #ifndef MP -->
		<view class="fac" @click="show=true">
			<text class="icon" :class="options.class">&#xe7ec;</text>
			<text class="ml2" :class="options.class" v-if="label">{{label}}</text>
		</view>
		<!-- #endif -->
		<!-- #ifdef MP -->
		<button open-type="share" class="fac bn">
			<text class="icon" :class="options.class">&#xe7ec;</text>
			<text class="ml2" :class="options.class" v-if="label">{{label}}</text>
		</button>
		<!-- #endif -->
		<u-popup v-if="providers.length>0" v-model:show="show" mode="bottom">
			<view class="fjb">
				<view @click="share(item)" v-for="(item, i) in providers" :key="i" class="f1 fjc py6">
					<view class="fdc fac">
						<u-icon :name="item.icon" :size="60" :color="item.color" />
						<view class="c3 mt3">{{item.text}}</view>
					</view>
				</view>
			</view>
		</u-popup>
	</view>
</template>
<script>
import util from '@/utils/util'
// #ifdef H5-WEIXIN
import wechat from '@/utils/wechat'
// #endif

const map = [
	{ id: 'weixin', text: '微信', icon: 'weixin-fill', color: '#00CC00', desc: '分享到微信好友' },
	{ id: 'moments', text: '朋友圈', icon: 'moments', color: '#69BD2E',  desc: '分享到微信朋友圈' },
	{ id: 'qq', text: 'QQ', icon: 'qq-fill', color: '#1296DB',  desc: '分享到QQ好友' },
	{ id: 'weibo', text: '微博', icon: 'weibo', color: '#FF000E',  desc: '分享到新浪微博' }
];

export default {
	props: {
		// 对齐方式, top - 顶部， middle - 居中, bottom - 底部
		label: {
			type: String,
			default: ''
		},
		options: { type: Object, default: () => {
			color: '#999'
		}}
	},
	data() {
		return {
			show: false,
			type: 1,  // 分享类型 { 1: 文字, 2: 图片, 3: 图文, 5: 小程序 }
			providers: []
		}
	},
	computed:{
		isDisableButton() {
			return (item) => {
				if(this.type === 0 && item.id === 'qq'){
					return true;
				}
				if(this.type === 5 && item.name !== '分享到微信好友'){
					return true;
				}
				return false;
			}
		}
	},
	created () {
		// #ifdef H5
		// #ifdef H5-WEIXIN
		wechat.shareData(this.options)
		// #endif
		// #ifndef H5-WEIXIN
		this.providers = map.filter(r=>['weixin', 'qq', 'weibo'].includes(r.id))
		// #endif
		// #endif
		// #ifdef MP-WEIXIN
		uni.showShareMenu({
			withShareTicket: true,  
			menus: ['shareAppMessage', 'shareTimeline']
		})
		this.providers = map.filter(r=>['weixin', 'moments'].includes(r.id))
		// #endif
		// #ifdef APP-PLUS
		uni.getProvider({
			service: 'share',
			success (e) {
				this.providers = map.filter(r=>e.provider.includes(r.name))
			},
			fail (e) {
				util.msg('获取分享通道失败')
			}
		});		
		// #endif
	},
	methods: {
		// #ifdef H5
		share (item){
			plus.share.sendWithSystem({type:'text',content:'分享内容',href:'http://www.dcloud.io/'}, () => {
				util.toast('分享成功');
			}, (e) => {
				util.toast('分享失败：'+JSON.stringify(e))
			});
		},
		// #endif
		// #ifdef APP-PLUS
		async app(e) {
			if(!this.options.title && (this.type === 1 || this.type === 0)){
				util.msg('分享内容不能为空')
				return;
			}
			if(!this.options.img && (this.type === 2 || this.type === 0)){
				util.msg('分享图片不能为空')
				return;
			}
			const options = {
				provider: e.id,
				scene: e.type && e.type === 'WXSenceTimeline' ? 'WXSenceTimeline' : 'WXSceneSession', //WXSceneSession”分享到聊天界面，“WXSenceTimeline”分享到朋友圈，“WXSceneFavorite”分享到微信收藏     
				type: this.type,
				success (e) {
					util.msg('分享成功')
				},
				fail (e) {
					util.msg(e.errMsg)
				},
				complete () {
					// console.log('分享操作结束!')
				}
			}
			switch (this.type){
				case 0:
					options.summary = this.options.title;
					options.imageUrl = this.options.img;
					options.title = this.options.title;
					options.href = this.options.link || location.href;
					break;
				case 1:
					options.summary = this.options.title;
					break;
				case 2:
					options.imageUrl = this.options.img;
					break;
				case 5:
					options.imageUrl = this.options.img ? this.img : 'https://img-cdn-qiniu.dcloud.net.cn/uniapp/app/share-logo@3.png'
					options.title = this.options.title
					options.miniProgram = {
						id:'gh_33446d7f7a26',
						path:'/pages/tabBar/component/component',
						webUrl: location.href,
						type:0
					};
					break;
				default:
					break;
			}
			if(options.type === 0 && plus.os.name === 'iOS'){//如果是图文分享，且是ios平台，则压缩图片 
				options.imageUrl = await image.compress();
			}
			if(options.type === 1 && options.provider === 'qq'){//如果是分享文字到qq，则必须加上href和title
				options.href = this.options.link || location.href;
				options.title = this.options.title;
			}
			uni.share(options);
		}
		// #endif		
	}
}
</script>

<style scoped>
	.none{
		line-height: 1;
		background-color: rgba(255, 255, 255, 0) !important;
		padding: 0 !important;
	}
	.none::after{
		border: none !important;
	}
</style>